<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>趣寻网</title>
	<link href="css/bootstrap.min.css" rel="stylesheet">
  </head>

  <body style="background-color: #eee;">
  	<div class="container-fluid" style="padding: 0px;">
	    <!-- 图片轮播 -->
	    <div id="myCarousel" class="carousel slide" style="height: 120px;">
		    <!-- 轮播（Carousel）指标 -->
		    <ol class="carousel-indicators">
		        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
		        <li data-target="#myCarousel" data-slide-to="1"></li>
		        <li data-target="#myCarousel" data-slide-to="2"></li>
		    </ol>   
		    <!-- 轮播（Carousel）项目 -->
		    <div class="carousel-inner">
		        <div class="item active">
		            <img src="img/main_109352.jpg" alt="First slide" style="height: 120px; width: 100%;" />
		        </div>
		        <div class="item">
		            <img src="img/main_109352.jpg" alt="Second slide" style="height: 120px;width: 100%;" />
		        </div>
		        <div class="item">
		            <img src="img/main_109352.jpg" alt="Third slide" style="height: 120px;width: 100%;" />
		        </div>
		    </div>
		    <!-- 轮播（Carousel）导航 -->
		    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;
		    </a>
		    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;
		    </a>
		</div>
		<!--  列表数据 -->
		<dl style="margin-top: 10px;">
			<dd class="media panel" style="padding: 10px;margin-bottom: 0px;">
				<div class="media-left">
			    	<a href="detail.html">
			      		<img class="media-object" src="" alt="" width="64" height="64" />
			    	</a>
			    </div>
			    <div class="media-body">
			    	<h4 class="media-heading color"><a href="detail.html">千万空中飞人保</a></h4>
			    	<p class="mark"><a href="detail.html">出国游学的专属保障，涵盖学习、生活、医疗、意外、财物、行程延误等各个方面，漂洋过海孤身在外。异国他乡有『安联』为您保驾护航。</a></p>
			    	<div class="pull-left">
			    		<span style="font-size:2.1rem;color:#d9534f;">¥20</span>元起
			    	</div>
					<div class="pull-right" style="margin-right: 10px;">
						<a class="btn btn-default" href="detail.html" role="button">立即投保</a>
					</div>
			    </div>
			</dd>

			<dd class="media panel" style="padding: 10px;">
				<div class="media-left">
			    	<a href="detail.html">
			      		<img class="media-object" src="" alt="" width="64" height="64" />
			    	</a>
			    </div>
			    <div class="media-body">
			    	<h4 class="media-heading"><a href="detail.html">千万空中飞人保</a></h4>
			    	<p class="mark"><a href="detail.html">出国游学的专属保障，涵盖学习、生活、医疗、意外、财物、行程延误等各个方面，漂洋过海孤身在外。异国他乡有『安联』为您保驾护航。</a></p>
			    
		    		<div class="pull-left">
			    		<span style="font-size:2.1rem;color:#d9534f;">¥20</span>元起
			    	</div>
					<div class="pull-right" style="margin-right: 10px;">
						<a class="btn btn-default" href="detail.html" role="button">立即投保</a>
					</div>
			    </div>
			</dd>
		</dl>
		
		<div class="row">
			<div class="col-md-12">
				<a href="" class="btn btn-default btn-lg btn-block" role="button">查看全部</a>
			</div>
		</div>
		
		<!-- 悬浮底部 -->
		<nav class="navbar navbar-default navbar-fixed-bottom" style="padding: 10px 0px;">
		    <div class="navbar-inner navbar-content-center">
		    	<div class="row">
		        	<div class="col-xs-4">
		        		<a href="index.html" class="btn btn-block" role="button"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span></a>
		        	</div>
		        	<div class="col-xs-4">
		        		<a href="" class="btn btn-block active" role="button"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a>
		        	</div>
		        	<div class="col-xs-4">
		        		<a href="mine.html" class="btn btn-block" role="button"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></a>
		        	</div>
		        </div>
		    </div>
		</nav>

		<!-- 底部 -->

	</div>
	<!-- 列表页 -->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script>
    	$(function(){
    		$('.carousel').carousel();	
    	});
    </script>
  </body>
</html>